<template>
<onekit-page>
<onekit-view onekit-class="container">
	<div is="onekit-template-head" :DATA="`${JSON.stringify({title:'chooseVideo'})}`"></div>
	<onekit-view onekit-class="page-body">
		<onekit-view onekit-class="page-section">
			<onekit-view onekit-class="weui-cells weui-cells_after-title">
				<onekit-view onekit-class="weui-cell weui-cell_input">
					<onekit-view onekit-class="weui-cell__hd">
						<onekit-view onekit-class="weui-label">视频来源</onekit-view>
					</onekit-view>
					<onekit-view onekit-class="weui-cell__bd">
						<onekit-picker :range="sourceType" :value="sourceTypeIndex" @Change="sourceTypeChange">
							<onekit-view onekit-class="weui-input">{{sourceType[sourceTypeIndex]}}</onekit-view>
						</onekit-picker>
					</onekit-view>
				</onekit-view>
				<onekit-view onekit-class="weui-cell weui-cell_input">
					<onekit-view onekit-class="weui-cell__hd">
						<onekit-view onekit-class="weui-label">摄像头</onekit-view>
					</onekit-view>
					<onekit-view onekit-class="weui-cell__bd">
						<onekit-picker :range="camera" :value="cameraIndex" @Change="cameraChange">
							<onekit-view onekit-class="weui-input">{{camera[cameraIndex]}}</onekit-view>
						</onekit-picker>
					</onekit-view>
				</onekit-view>
				<onekit-view onekit-class="weui-cell weui-cell_input">
					<onekit-view onekit-class="weui-cell__hd">
						<onekit-view onekit-class="weui-label">拍摄长度</onekit-view>
					</onekit-view>
					<onekit-view onekit-class="weui-cell__bd">
						<onekit-picker :range="duration" :value="durationIndex" @Change="durationChange">
							<onekit-view onekit-class="weui-input">{{duration[durationIndex]}}</onekit-view>
						</onekit-picker>
					</onekit-view>
				</onekit-view>
			</onekit-view>
			<onekit-view onekit-class="page-body-info">
				<template v-if="src == ''">
					<onekit-view onekit-class="image-plus image-plus-nb" @click.native="chooseVideo">
						<onekit-view onekit-class="image-plus-horizontal"></onekit-view>
						<onekit-view onekit-class="image-plus-vertical"></onekit-view>
					</onekit-view>
					<onekit-view onekit-class="image-plus-text">添加视频</onekit-view>
				</template>
				<template v-if="src != ''">
					<onekit-video onekit-class="video" :src="src"></onekit-video>
				</template>
			</onekit-view>
		</onekit-view>
	</onekit-view>
</onekit-view>
</onekit-page></template>
<script>
/* eslint-disable */
import Vue from 'vue';
import onekit_template_0 from '../../../common/head.head.vue';Vue.component('onekit-template-head',onekit_template_0);
import onekit_template_1 from '../../../common/foot.foot.vue';Vue.component('onekit-template-foot',onekit_template_1);
const ONEKIT_JSON= {
  "navigationBarTitleText": "拍摄/选择视频",
  "usingComponents": {
    
  }
};
const ONEKIT_SJS = {
};
import wx from '../../../../weixin2vue/wx.js';
import Macro from '../../../../weixin2vue/Macro.js';
const {getApp,getCurrentPages} = Macro;
import Page from '../../../../weixin2vue/OnekitPage.js';
import Component from '../../../../weixin2vue/OnekitComponent.js';
const sourceType = [
  [
    'camera'
  ],
  [
    'album'
  ],
  [
    'camera',
    'album'
  ]
];
const camera = [
  [
    'front'
  ],
  [
    'back'
  ],
  [
    'front',
    'back'
  ]
];
const duration = Array.apply(null,{
    "length":60
}).map(function(n,i){
  return i + 1;
});
export default Page(ONEKIT_JSON,["sourceType","sourceTypeIndex","camera","cameraIndex","duration","durationIndex","src"],ONEKIT_SJS,{
    "onShareAppMessage"(){
      return {
        "title":'拍摄/选择视频',
        "path":'packageAPI/pages/video/video'
};
    },
    "data":{
        "sourceTypeIndex":2,
        "sourceType":[
          '拍摄',
          '相册',
          '拍摄或相册'
        ],
        "cameraIndex":2,
        "camera":[
          '前置',
          '后置',
          '前置或后置'
        ],
        "durationIndex":59,
        "duration":duration.map(function(t){
          return t + '秒';
        }),
        "src":''
},
    "sourceTypeChange"(e){
      this.setData({
        "sourceTypeIndex":e.detail.value
});
    },
    "cameraChange"(e){
      this.setData({
        "cameraIndex":e.detail.value
});
    },
    "durationChange"(e){
      this.setData({
        "durationIndex":e.detail.value
});
    },
    "chooseVideo"(){
      const that = this;
      wx.chooseVideo({
        "sourceType":sourceType[this.data.sourceTypeIndex],
        "camera":camera[this.data.cameraIndex],
        "maxDuration":duration[this.data.durationIndex],
        "success"(res){
          that.setData({
            "src":res.tempFilePath
});
        }
});
    }
});

</script>
<style 
 lang="css">
@import '/common/lib/weui.css';
.page-body-info {
  display: flex ;
  margin-top: 20px ;
  padding: 0 ;
  height: 330px ;
  border-top: 1px solid var(--weui-FG-3) ;
  border-bottom: 1px solid var(--weui-FG-3) ;
  align-items: center ;
  justify-content: center ;
}
</style>